apps/app/src/app/[locale]/(app)/(dashboard)/evidence/[id]/Actions/uploadEvidenceFile.ts (3)

9-11: Validate environment variables at build time
These checks are performed at runtime. It is recommended to consolidate them into a configuration loader or a boot-up validation routine, ensuring a fail-fast mechanism during startup rather than runtime to minimize unexpected behavior.

---

36-46: Consistent approach to error handling
While the main logic returns { success: false, error } for business rule validation, the AWS credential check at lines 9-11 throws an error directly. Adopting one coherent pattern (either throwing exceptions or returning structured responses) throughout the file streamlines error handling and makes behavior more predictable.

---

80-88: Consider concurrency conflicts with array fields
Appending file URLs to an array in concurrent uploads can result in a last-write-wins situation, potentially overwriting other updates. A separate table or more robust transactional approach may mitigate race conditions and data-loss risks.

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/[id]/Actions/getEvidenceFileUrl.ts (3)

9-19: Centralize environment checks
These environment variable checks repeat across multiple files. A shared configuration loader would help to keep the code DRY and ensure a single source of truth for AWS credentials and settings.

---

34-47: Guard against unusual or region-specific S3 URLs
While this regex-based extraction handles standard patterns, consider using robust URL parsing utilities to handle unexpected edge cases or region-specific S3 domains. This can help avoid future maintenance headaches.

---

66-80: Unify error handling patterns
Here, errors are thrown instead of returning a consistent structure (e.g., { success: false, error }). Aligning this approach with other action files enables uniform handling of errors downstream and simplifies client-side response parsing.

apps/app/src/types/actions.ts (1)

1-5: Adopt the new interface in other actions
This ActionResponse interface promotes a uniform return type. Consider adopting it in recently added actions like getEvidenceFileUrl to avoid mixing thrown errors with structured responses and provide a consistent experience throughout the application.

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/Components/data-table/data-table-header.tsx (1)

13-13: Add type safety for column headers.

The type cast to string could lead to runtime errors if the header is not a string. Consider adding type checking or using a type guard.

Apply this diff to improve type safety:

-            {column.columnDef.header as string}
+            {typeof column.columnDef.header === 'string' ? column.columnDef.header : String(column.columnDef.header)}

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/[id]/types.ts (2)

3-8: Consider adding URL validation.

The URLs are typed as strings without validation. Consider using a URL validation utility or a custom type guard to ensure valid URLs.

Example implementation:

function isValidUrl(url: string): boolean {
  try {
    new URL(url);
    return true;
  } catch {
    return false;
  }
}

export interface UploadUrlResponse {
  uploadUrl: string & { __brand: 'ValidatedUrl' };
  fileUrl: string & { __brand: 'ValidatedUrl' };
}

// Usage:
function validateUrls(response: { uploadUrl: string, fileUrl: string }): UploadUrlResponse {
  if (!isValidUrl(response.uploadUrl) || !isValidUrl(response.fileUrl)) {
    throw new Error('Invalid URL');
  }
  return response as UploadUrlResponse;
}

---

10-13: Add URL validation and array constraints.

Consider adding URL validation and constraints for the additionalUrls array to handle edge cases.

Example implementation:

export interface UpdateUrlsResponse
  extends ActionResponse<{
    additionalUrls: NonEmptyArray<ValidatedUrl>;
  }> {}

type ValidatedUrl = string & { __brand: 'ValidatedUrl' };
type NonEmptyArray<T> = [T, ...T[]];

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/[id]/Components/FileIcon.tsx (1)

9-19: Improve robustness and maintainability of file type detection.

Consider the following improvements:

1. Handle edge cases in extension extraction
2. Move file type mappings to a configuration object
3. Add support for more file types

Apply this diff to improve the implementation:

+const FILE_TYPE_CONFIG = {
+  image: ['jpg', 'jpeg', 'png', 'gif', 'webp', 'svg', 'bmp'],
+  document: ['pdf', 'doc', 'docx', 'txt', 'rtf', 'odt', 'pages'],
+} as const;
+
 export function FileIcon({ fileName }: FileIconProps) {
-  const extension = fileName.split(".").pop()?.toLowerCase();
+  const extension = fileName.includes('.') ? fileName.split('.').pop()?.toLowerCase() : '';
 
-  if (extension && ["jpg", "jpeg", "png", "gif", "webp"].includes(extension)) {
+  if (extension && FILE_TYPE_CONFIG.image.includes(extension)) {
     return <FileImage className="h-12 w-12 text-muted-foreground" />;
   }
-  if (extension && ["pdf", "doc", "docx", "txt"].includes(extension)) {
+  if (extension && FILE_TYPE_CONFIG.document.includes(extension)) {
     return <FileText className="h-12 w-12 text-muted-foreground" />;
   }
   return <File className="h-12 w-12 text-muted-foreground" />;
 }

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/[id]/hooks/useOrganizationEvidence.ts (2)

13-19: Improve error handling with specific error types.

The current error handling doesn't distinguish between different types of errors, which could make debugging more difficult.

Apply this diff to improve error handling:

+class OrganizationEvidenceError extends Error {
+  constructor(message: string, public code: string) {
+    super(message);
+    this.name = 'OrganizationEvidenceError';
+  }
+}
+
 if (!result || "error" in result) {
   throw new Error(
     typeof result?.error === "string"
       ? result.error
       : "Failed to fetch organization evidence"
   );
 }
+  if (!result) {
+    throw new OrganizationEvidenceError('No result returned', 'NO_RESULT');
+  }
+  if ('error' in result) {
+    throw new OrganizationEvidenceError(
+      typeof result.error === 'string' ? result.error : 'Unknown error',
+      'API_ERROR'
+    );
+  }

---

24-33: Enhance SWR configuration for better error handling and UX.

Consider adding error retry configuration and loading state handling to improve the user experience.

Apply this diff to improve the implementation:

 export function useOrganizationEvidence({ id }: UseOrganizationEvidenceProps) {
   return useSWR(
     ["organization-evidence", id],
     () => fetchOrganizationEvidence({ id }),
     {
       revalidateOnFocus: false,
       revalidateOnReconnect: false,
+      errorRetryCount: 3,
+      errorRetryInterval: 1000,
+      loadingTimeout: 3000,
+      onLoadingSlow: () => {
+        console.warn('Slow loading detected for organization evidence');
+      },
+      onError: (error) => {
+        console.error('Failed to fetch organization evidence:', error);
+      },
     }
   );
 }

apps/app/src/app/[locale]/(app)/(dashboard)/controls/[id]/Components/data-table/data-table-header.tsx (3)

18-47: Improve component reusability.

The component has hardcoded column names and styles which limits its reusability. Consider accepting column configurations as props.

Apply this diff to improve reusability:

 type Props = {
   table?: {
     getIsAllPageRowsSelected: () => boolean;
     getIsSomePageRowsSelected: () => boolean;
     getAllLeafColumns: () => {
       id: string;
       getIsVisible: () => boolean;
     }[];
     toggleAllPageRowsSelected: (value: boolean) => void;
   };
   loading?: boolean;
+  columns: {
+    id: string;
+    label: string;
+    className?: string;
+  }[];
 };

 export function DataTableHeader({ table, loading, columns }: Props) {
   const isVisible = (id: string) =>
     loading ||
     table
       ?.getAllLeafColumns()
       .find((col) => col.id === id)
       ?.getIsVisible();

   return (
     <TableHeader>
       <TableRow className="hover:bg-transparent">
-        {isVisible("type") && (
-          <TableHead className="h-11 px-4 text-left align-middle font-medium">
-            Type
-          </TableHead>
-        )}
-        {isVisible("description") && (
-          <TableHead className="h-11 px-4 text-left align-middle font-medium">
-            Description
-          </TableHead>
-        )}
-        {isVisible("status") && (
-          <TableHead className="h-11 px-4 text-left align-middle font-medium">
-            Status
-          </TableHead>
-        )}
+        {columns.map((column) =>
+          isVisible(column.id) && (
+            <TableHead
+              key={column.id}
+              className={`h-11 px-4 text-left align-middle font-medium ${column.className ?? ''}`}
+            >
+              {column.label}
+            </TableHead>
+          )
+        )}
       </TableRow>
     </TableHeader>
   );
 }

---

5-16: Refine Props interface to remove unused methods.

The Props interface includes methods that aren't used in the component (getIsAllPageRowsSelected, getIsSomePageRowsSelected, toggleAllPageRowsSelected). Consider refining it to only include what's needed.

Apply this diff to simplify the Props interface:

 type Props = {
   table?: {
-    getIsAllPageRowsSelected: () => boolean;
-    getIsSomePageRowsSelected: () => boolean;
     getAllLeafColumns: () => {
       id: string;
       getIsVisible: () => boolean;
     }[];
-    toggleAllPageRowsSelected: (value: boolean) => void;
   };
   loading?: boolean;
 };

---

18-47: Consider making the component more flexible and localizable.

The component has hardcoded column labels and a fixed set of columns. Consider:

1. Using a translation function for column labels
2. Making columns configurable through props

Apply this diff to improve flexibility and localization:

+import { useTranslations } from "next-intl";
+
+interface Column {
+  id: string;
+  label: string;
+}
+
+const DEFAULT_COLUMNS: Column[] = [
+  { id: "type", label: "evidence.type" },
+  { id: "description", label: "evidence.description" },
+  { id: "status", label: "evidence.status" }
+];
+
 export function DataTableHeader({ table, loading }: Props) {
+  const t = useTranslations();
+  const columns = DEFAULT_COLUMNS;
+
   const isVisible = (id: string) =>
     loading ||
     table
       ?.getAllLeafColumns()
       .find((col) => col.id === id)
       ?.getIsVisible();

   return (
     <TableHeader>
       <TableRow className="hover:bg-transparent">
-        {isVisible("type") && (
-          <TableHead className="h-11 px-4 text-left align-middle font-medium">
-            Type
-          </TableHead>
-        )}
-        {isVisible("description") && (
-          <TableHead className="h-11 px-4 text-left align-middle font-medium">
-            Description
-          </TableHead>
-        )}
-        {isVisible("status") && (
-          <TableHead className="h-11 px-4 text-left align-middle font-medium">
-            Status
-          </TableHead>
-        )}
+        {columns.map((column) =>
+          isVisible(column.id) && (
+            <TableHead
+              key={column.id}
+              className="h-11 px-4 text-left align-middle font-medium"
+            >
+              {t(column.label)}
+            </TableHead>
+          )
+        )}
       </TableRow>
     </TableHeader>
   );
 }

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/[id]/hooks/useFileDelete.ts (3)

12-52: Add loading state to prevent duplicate requests.

The hook should track loading state to prevent multiple delete requests while one is in progress.

Apply this diff to add loading state:

 export function useFileDelete({ evidenceId, onSuccess }: UseFileDeleteProps) {
   const { toast } = useToast();
+  const [isDeleting, setIsDeleting] = useState(false);

   const handleDelete = useCallback(
     async (fileUrl: string) => {
+      if (isDeleting) return;
       try {
+        setIsDeleting(true);
         const response = await deleteEvidenceFile({
           evidenceId,
           fileUrl,
         });

         if (!response?.data) {
           throw new Error("Failed to delete file");
         }

         if (!response.data.success) {
           throw new Error(response.data.error || "Failed to delete file");
         }

         await onSuccess();
         toast({
           title: "Success",
           description: "File deleted successfully",
         });
       } catch (error) {
         console.error("Error deleting file:", error);
         toast({
           title: "Error",
           description:
             error instanceof Error ? error.message : "Failed to delete file",
           variant: "destructive",
         });
+      } finally {
+        setIsDeleting(false);
       }
     },
-    [evidenceId, onSuccess, toast]
+    [evidenceId, onSuccess, toast, isDeleting]
   );

   return {
     handleDelete,
+    isDeleting,
   };
 }

---

7-10: Consider making onSuccess callback optional.

The onSuccess callback might not always be needed. Consider making it optional to improve flexibility.

Apply this diff:

 interface UseFileDeleteProps {
   evidenceId: string;
-  onSuccess: () => Promise<void>;
+  onSuccess?: () => Promise<void>;
 }

---

49-51: Add loading state for better UX.

Consider adding a loading state to provide feedback during the deletion process.

Apply this diff:

+  const [isDeleting, setIsDeleting] = useState(false);
+
   const handleDelete = useCallback(
     async (fileUrl: string) => {
+      setIsDeleting(true);
       try {
         // ... existing code ...
       } catch (error) {
         // ... existing code ...
+      } finally {
+        setIsDeleting(false);
       }
     },
-    [evidenceId, onSuccess, toast]
+    [evidenceId, onSuccess, toast, setIsDeleting]
   );
 
   return {
     handleDelete,
+    isDeleting,
   };

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/Actions/getOrganizationEvidence.ts (3)

25-29: Add type safety with const assertions for error responses.

Consider adding as const to the error response object to improve type inference and prevent accidental modifications.

-      return {
-        success: false,
-        error: "Not authorized - no organization found",
-      };
+      return {
+        success: false,
+        error: "Not authorized - no organization found",
+      } as const;

---

42-47: Add type safety with const assertions for not found response.

Similarly, add as const to the not found response object.

-      return {
-        success: false,
-        error: "Evidence not found",
-      };
+      return {
+        success: false,
+        error: "Evidence not found",
+      } as const;

---

49-53: Add type safety with const assertions for success response.

Complete the type safety improvements by adding as const to the success response.

-      return {
-        success: true,
-        data: evidence,
-      };
+      return {
+        success: true,
+        data: evidence,
+      } as const;

apps/app/src/app/[locale]/(app)/(dashboard)/controls/[id]/Components/data-table/columns.tsx (2)

38-54: Improve status column maintainability and accessibility.

The status logic could be more maintainable and accessible:

1. Extract status logic to a separate function
2. Add aria-label for screen readers

    cell: ({ row }) => {
-      const requirement = row.original;
-      const isCompleted =
-        requirement.type === "policy"
-          ? requirement.organizationPolicy?.status === "published"
-          : false;
+      const isCompleted = getRequirementStatus(row.original);
 
       return (
-        <div className="flex items-center justify-center">
+        <div 
+          className="flex items-center justify-center"
+          aria-label={isCompleted ? "Completed" : "Not completed"}
+        >
           {isCompleted ? (
             <CheckCircle2 size={16} className="text-green-500" />
           ) : (
             <XCircle size={16} className="text-red-500" />
           )}
         </div>
       );
     },

+ const getRequirementStatus = (requirement: RequirementType): boolean => {
+   return requirement.type === "policy" && 
+     requirement.organizationPolicy?.status === "published";
+ };

---

30-32: Add title attribute for truncated text.

When using truncation, add a title attribute to show the full text on hover.

    cell: ({ row }) => (
-      <div className="truncate">{row.original.description}</div>
+      <div className="truncate" title={row.original.description || ""}>
+        {row.original.description}
+      </div>
    ),

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/Components/EvidenceList.tsx (2)

28-28: Use translated error message.

The error message should be translated using the i18n function.

-  if (error) return <div>Error loading evidence tasks</div>;
+  if (error) return <div>{t("evidence.list.error")}</div>;

---

36-41: Add accessibility attributes to search input.

Enhance accessibility by adding aria-label and role attributes.

          <Input
            placeholder={t("common.filters.search")}
            onChange={(e) => handleSearch(e.target.value)}
            defaultValue={search || ""}
            className="max-w-sm"
+           aria-label={t("common.filters.search")}
+           role="searchbox"
          />

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/[id]/Actions/updateEvidenceUrls.ts (1)

47-55: Use database transaction for atomic updates.

Wrap the database operations in a transaction to ensure atomicity.

-      const updatedEvidence = await db.organizationEvidence.update({
-        where: { id: evidenceId },
-        data: {
-          additionalUrls: urls,
-        },
-        include: {
-          evidence: true,
-        },
-      });
+      const updatedEvidence = await db.$transaction(async (tx) => {
+        return tx.organizationEvidence.update({
+          where: { id: evidenceId },
+          data: {
+            additionalUrls: urls,
+          },
+          include: {
+            evidence: true,
+          },
+        });
+      });

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/Actions/getAllOrganizationControlRequirements.ts (2)

9-11: Implement search functionality.

The schema includes a search parameter, but it's not utilized in the query. Consider implementing search functionality to filter the results.

 where: {
   organizationControl: {
     organizationId: user.organizationId,
+    OR: search ? [
+      { control: { name: { contains: search, mode: 'insensitive' } } },
+      { control: { description: { contains: search, mode: 'insensitive' } } }
+    ] : undefined
   },
 },

---

31-50: Consider implementing pagination for large datasets.

The current implementation fetches all records without pagination, which could impact performance with large datasets.

 interface GetAllOrganizationControlRequirementsInput {
   search?: string | null;
+  page?: number;
+  limit?: number;
 }

 const schema = z.object({
   search: z.string().optional().nullable(),
+  page: z.number().optional().default(1),
+  limit: z.number().optional().default(10),
 });

 // In the query
 const skip = (page - 1) * limit;
 await db.organizationControlRequirement.findMany({
   where: { ... },
+  skip,
+  take: limit,
   include: { ... },
 });

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/[id]/hooks/useFilePreview.ts (2)

35-35: Remove console.log statement.

Remove debug logging from production code.

-        console.log("Preview URL response:", response);

---

26-64: Consider adding cleanup on unmount.

The loading state might be left in an incorrect state if the component unmounts during the request.

 const getPreviewUrl = useCallback(
   async (fileUrl: string): Promise<string> => {
+    const abortController = new AbortController();
     setIsLoading(true);
     try {
       const response = await getEvidenceFileUrl({
         evidenceId,
         fileUrl,
+        signal: abortController.signal,
       });

       if (!response?.data) {
         throw new Error("Failed to get signed URL");
       }

       const result = response.data as ActionResponse;
       if (!result.signedUrl) {
         throw new Error("Invalid signed URL response");
       }

       return result.signedUrl;
     } catch (error) {
+      if (error.name === 'AbortError') {
+        return;
+      }
       console.error("Error getting file URL:", error);
       const errorMessage =
         error instanceof Error
           ? error.message
           : "Failed to load file preview";
       toast({
         title: "Error",
         description: errorMessage,
         variant: "destructive",
       });
       throw error;
     } finally {
       setIsLoading(false);
     }
   },
   [evidenceId, toast]
 );

+ useEffect(() => {
+   return () => {
+     abortController.abort();
+   };
+ }, []);

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/Components/data-table/data-table.tsx (2)

30-35: Add accessibility attributes to the clickable row.

The table row is clickable but missing proper accessibility attributes.

 <TableRow
   key={row.id}
   data-state={row.getIsSelected() && "selected"}
   className="hover:bg-muted/50 cursor-pointer"
+  role="link"
+  tabIndex={0}
+  aria-label={`View evidence task ${row.original.id}`}
+  onKeyDown={(e) => {
+    if (e.key === 'Enter' || e.key === ' ') {
+      router.push(`/evidence/${row.original.id}`);
+    }
+  }}
   onClick={() => router.push(`/evidence/${row.original.id}`)}
 >

---

14-21: Add loading state handling.

Consider adding a loading state to improve user experience while data is being fetched.

-export function DataTable({ data }: { data: EvidenceTaskRow[] }) {
+export function DataTable({ 
+  data,
+  isLoading
+}: { 
+  data: EvidenceTaskRow[];
+  isLoading?: boolean;
+}) {
   const router = useRouter();
   const table = useReactTable({
     data,
     columns,
     getCoreRowModel: getCoreRowModel(),
   });

+  if (isLoading) {
+    return (
+      <div className="w-full h-24 flex items-center justify-center">
+        <div className="animate-spin">Loading...</div>
+      </div>
+    );
+  }

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/[id]/Actions/deleteEvidenceFile.ts (2)

43-70: Use transaction for database operations.

Consider using a transaction to ensure data consistency when updating the evidence record.

     try {
+      return await db.$transaction(async (tx) => {
         // Check if evidence exists and belongs to organization
-        const evidence = await db.organizationEvidence.findFirst({
+        const evidence = await tx.organizationEvidence.findFirst({
           where: {
             id: evidenceId,
             organizationId: user.organizationId,
             fileUrls: {
               has: fileUrl,
             },
           },
         });

         if (!evidence) {
           return {
             success: false,
             error: "Evidence or file not found",
           };
         }

         // Remove the file URL from the evidence record
-        await db.organizationEvidence.update({
+        await tx.organizationEvidence.update({
           where: { id: evidenceId },
           data: {
             fileUrls: {
               set: evidence.fileUrls.filter((url) => url !== fileUrl),
             },
           },
         });

         return {
           success: true,
         };
+      });
     } catch (error) {

---

63-70: Consider implementing soft delete.

Instead of permanently removing the file URL, consider implementing a soft delete mechanism to maintain a history of file operations.

         await db.organizationEvidence.update({
           where: { id: evidenceId },
           data: {
             fileUrls: {
               set: evidence.fileUrls.filter((url) => url !== fileUrl),
             },
+            deletedFileUrls: {
+              push: {
+                url: fileUrl,
+                deletedAt: new Date(),
+                deletedBy: user.id,
+              },
+            },
           },
         });

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/Actions/getOrganizationEvidenceTasks.ts (2)

31-65: Consider adding pagination to the database query.

While the current implementation works well for searching evidence tasks, it might benefit from pagination to handle large datasets more efficiently.

 const evidenceTasks = await db.organizationEvidence.findMany({
+  take: 10,  // Limit results per page
+  skip: (page - 1) * 10,  // Skip based on page number
   where: {
     organizationId: user.organizationId,
     ...(search

---

71-77: Consider adding more detailed error information for debugging.

While the current error handling is good, it could be enhanced to include more context for debugging purposes while keeping the user-facing message generic.

 } catch (error) {
-  console.error("Error fetching evidence tasks:", error);
+  console.error("Error fetching evidence tasks:", {
+    error,
+    organizationId: user.organizationId,
+    searchQuery: search
+  });
   return {

apps/app/src/app/[locale]/(app)/(dashboard)/controls/[id]/Components/data-table/data-table.tsx (2)

27-34: Consider extracting navigation logic to a custom hook.

The row click handler contains business logic that could be reused across components. Consider extracting it to a custom hook for better maintainability and reusability.

+const useRequirementNavigation = () => {
+  const router = useRouter();
+  
+  return useCallback((requirement: RequirementType) => {
+    if (requirement.type === "policy" && requirement.organizationPolicy?.policy?.id) {
+      router.push(`/policies/${requirement.organizationPolicy.policy.id}`);
+    }
+  }, [router]);
+};

 export function DataTable({ data }: DataTableProps) {
   const router = useRouter();
-  const onRowClick = (requirement: RequirementType) => {
-    if (requirement.type === "policy" && requirement.organizationPolicy?.policy?.id) {
-      router.push(`/policies/${requirement.organizationPolicy.policy.id}`);
-    }
-  };
+  const onRowClick = useRequirementNavigation();

---

66-66: Consider localizing the "No requirements found" message.

The hardcoded message should be moved to a localization file for better internationalization support.

-                  No requirements found.
+                  {t("common.no_requirements_found")}

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/[id]/Components/FileUpload.tsx (3)

18-29: Consider moving file type restrictions to a configuration file.

The accepted file types could be moved to a separate configuration file for better maintainability and reuse across components.

---

30-30: Consider making the file size limit configurable via environment variables.

The hardcoded 10MB limit could be made configurable through environment variables for different deployment environments.

-  maxSize = 10 * 1024 * 1024, // 10MB
+  maxSize = process.env.NEXT_PUBLIC_MAX_UPLOAD_SIZE_MB 
+    ? parseInt(process.env.NEXT_PUBLIC_MAX_UPLOAD_SIZE_MB) * 1024 * 1024
+    : 10 * 1024 * 1024, // Default to 10MB

---

49-84: Enhance accessibility by adding ARIA attributes.

The file upload component could benefit from additional ARIA attributes to improve accessibility.

       <div
         {...getRootProps()}
+        role="button"
+        aria-label="File upload area"
         className={cn(

apps/app/src/app/[locale]/(app)/(dashboard)/controls/[id]/Components/SingleControl.tsx (2)

25-25: Consider adding a loading state component.

Instead of returning null, consider showing a loading skeleton or spinner for better user experience.

-  if (!control || !controlProgress) return null;
+  if (!control || !controlProgress) {
+    return <LoadingSkeleton />;
+  }

---

29-34: Consider extracting status calculation logic to a utility function.

The status calculation logic could be moved to a separate utility function for better maintainability and testing.

+const getProgressStatus = (progress: { completed: number }): StatusType => {
+  if (progress.completed > 0) return "in_progress";
+  return progress.completed === 0 ? "not_started" : "completed";
+};

-  const progressStatus =
-    controlProgress?.progress?.completed > 0
-      ? "in_progress"
-      : controlProgress?.progress?.completed === 0
-        ? "not_started"
-        : "completed";
+  const progressStatus = getProgressStatus(controlProgress.progress);

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/Components/data-table/columns.tsx (2)

80-84: Enhance accessibility of status indicators.

The status indicators use color alone to convey information. While the icons help, we should ensure WCAG compliance for color contrast and add ARIA labels.

-            <XCircle size={16} className="text-red-500 shrink-0" />
+            <XCircle 
+              size={16} 
+              className="text-red-500 shrink-0" 
+              aria-label="Draft status"
+            />
           )}
           <span
             className={
-              isPublished ? "text-sm text-green-600" : "text-sm text-red-600"
+              isPublished 
+                ? "text-sm text-green-600 font-medium" 
+                : "text-sm text-red-600 font-medium"
             }

Also applies to: 85-91

---

19-28: Consider memoizing tooltip content for performance.

The tooltip components are recreated on every render. Consider memoizing them using useMemo for better performance, especially with large datasets.

+import { useMemo } from "react";

 cell: ({ row }) => {
-  return (
+  return useMemo(() => (
     <TooltipProvider>
       <Tooltip>
         <TooltipTrigger asChild>
           <div className="max-w-[200px] truncate">{row.original.name}</div>
         </TooltipTrigger>
         <TooltipContent>{row.original.name}</TooltipContent>
       </Tooltip>
     </TooltipProvider>
-  );
+  ), [row.original.name]);
 }

Also applies to: 35-49, 56-67

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/[id]/Components/FileSection.tsx (1)

82-84: Enhance grid accessibility and responsiveness.

The grid layout should include ARIA roles and better responsive design for different screen sizes.

-      <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
+      <div 
+        role="grid"
+        className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4"
+        aria-label="Uploaded files grid"
+      >

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/[id]/Components/EvidenceDetails.tsx (1)

30-50: Optimize loading state transitions.

The loading state could be more granular to prevent unnecessary full-page skeleton loading.

+  const [isInitialLoad, setIsInitialLoad] = useState(true);
+
+  useEffect(() => {
+    if (!isLoading && isInitialLoad) {
+      setIsInitialLoad(false);
+    }
+  }, [isLoading]);
+
-  if (isLoading) {
+  if (isLoading && isInitialLoad) {

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/[id]/hooks/useUrlManagement.ts (2)

24-31: Consider enhancing URL validation.

The current URL validation might allow some edge cases. Consider adding additional checks for:

• Maximum URL length
• Allowed protocols (e.g., only http/https)
• Valid characters in the URL

 function isValidUrl(url: string): boolean {
+  const MAX_URL_LENGTH = 2048;
+  const ALLOWED_PROTOCOLS = ['http:', 'https:'];
+
+  if (url.length > MAX_URL_LENGTH) return false;
+
   try {
-    new URL(url);
-    return true;
+    const parsedUrl = new URL(url);
+    return ALLOWED_PROTOCOLS.includes(parsedUrl.protocol);
   } catch {
     return false;
   }
 }

---

97-103: Improve error handling for server errors.

The error handling could be more specific about the type of error that occurred.

-      if (!result) {
-        throw new Error("Failed to update URLs");
-      }
-
-      if (result.serverError) {
-        throw new Error(result.serverError || "Failed to update URLs");
-      }
+      if (!result || result.serverError) {
+        const errorMessage = result?.serverError || "Failed to update URLs";
+        throw new Error(`Server error: ${errorMessage}`);
+      }

apps/app/src/app/[locale]/(app)/(dashboard)/evidence/[id]/Components/FileCard.tsx (1)

50-51: Enhance file type detection.

Consider using a more comprehensive approach for file type detection:

1. Move file type detection to a separate utility function
2. Add support for more image formats (e.g., svg, avif)
3. Add support for more document types (e.g., doc, docx)

+const FILE_TYPES = {
+  IMAGE: /\.(jpg|jpeg|png|gif|webp|svg|avif)$/i,
+  PDF: /\.pdf$/i,
+  DOCUMENT: /\.(doc|docx|txt|rtf)$/i,
+};
+
+function getFileType(fileName: string) {
+  if (FILE_TYPES.IMAGE.test(fileName)) return 'image';
+  if (FILE_TYPES.PDF.test(fileName)) return 'pdf';
+  if (FILE_TYPES.DOCUMENT.test(fileName)) return 'document';
+  return 'other';
+}
+
-  const isImage = /\.(jpg|jpeg|png|gif|webp)$/i.test(fileName);
-  const isPdf = /\.pdf$/i.test(fileName);
+  const fileType = getFileType(fileName);
+  const isImage = fileType === 'image';
+  const isPdf = fileType === 'pdf';

packages/db/prisma/seed.ts (1)

372-399: Add error handling to seedEvidence function.

While the function correctly seeds evidence data, it lacks error handling that's present in other seed functions. Consider wrapping the upsert operation in a try-catch block.

Apply this diff to add error handling:

 async function seedEvidence() {
   const evidenceRequirements = await prisma.controlRequirement.findMany({
     where: {
       type: RequirementType.evidence,
     },
   });

   console.log(`🔄 Processing ${evidenceRequirements.length} evidences`);

   for (const evidence of evidenceRequirements) {
     console.log(`  ⏳ Processing evidence: ${evidence.name}...`);

+    try {
       await prisma.evidence.upsert({
         where: {
           id: evidence.id,
         },
         update: {
           name: evidence.name,
           description: evidence.description,
         },
         create: {
           id: evidence.id,
           name: evidence.name,
           description: evidence.description,
         },
       });
+      console.log(`  ✅ Evidence ${evidence.name} processed`);
+    } catch (error) {
+      console.error(`  ❌ Error processing evidence ${evidence.name}:`, error);
+      if (error instanceof Error) {
+        console.error(`     Error details: ${error.message}`);
+      }
+    }
   }
 }

packages/db/prisma/migrations/20250220181557_name_required/migration.sql (1)

1-10: LGTM! Consider wrapping in a transaction for safety.

The migration safely handles the transition to a NOT NULL column by first updating NULL values to empty strings. This prevents any potential data loss or migration failures.

Consider wrapping the migration in a transaction to ensure atomicity:

+BEGIN;
 UPDATE "ControlRequirement" SET "name" = '' WHERE "name" IS NULL;
 ALTER TABLE "ControlRequirement" ALTER COLUMN "name" SET NOT NULL,
 ALTER COLUMN "name" SET DEFAULT '';
+COMMIT;

packages/db/prisma/schema.prisma (1)

1028-1049: New OrganizationEvidence Model.
The OrganizationEvidence model captures organization-specific evidence with fields for fileUrls and additionalUrls, along with links to the Organization and Evidence models.
The separation between fileUrls and additionalUrls suggests they serve different purposes—ensure this distinction is well documented to avoid confusion later.

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro